CSS * {margin: 0;padding: 0;} override
Posted
by StealthRT
on Stack Overflow
See other posts from Stack Overflow
or by StealthRT
Published on 2010-05-02T20:08:45Z
Indexed on
2010/05/02
20:18 UTC
Read the original article
Hit count: 872
Hey all, i am in need of some help with figuring out how to override the "* {margin: 0;padding: 0;}" in my css.
The reason why is that i have this css:
.postcomments { width: 547px; padding: 5px 5px 5px 5px; margin: 0 0 5px 0;}
.postcomments a { text-decoration: underline;}
.postcomments ul { margin: 0; padding: 0; list-style-type: none;}
.postcomments ul li { width: 547px; margin: 0 0 5px 0; padding: 0; list-style-type: none;}
.postcomments .right { color: #474747; font-size: 11px; background: #fff url('http://www.nextbowluser.com/img/ucBG.gif') no-repeat top left; line-height: 17px; padding: 5px 0 0 0; width: 430px; position: relative; float: right; min-height: 50px;}
.postcomments .right .bottom { padding: 0 5px 15px 5px; background: #fff url('http://www.nextbowluser.com/img/ucBG.gif') no-repeat bottom right; min-height: 50px;}
.postcomments .arrow { left: -15px; top: 20px; position: absolute;}
.avatar { border: none !important;}
.postcomments .left {float: left; margin: 0 7px 0 0;}
.postcomments .gravatar { background: #fff; width: 80px; height: 60px; margin: 0 0px 0 0; padding: 3px;}
.postcomments .name { font-size: 11px; margin: 2px 0 0 0; color: #000;}
.avatar { border: none !important;}
and it displays just fine WITHOUT the * {margin: 0;padding: 0;}:
1st comment
2nd comment
3rd comment
However, when i add that to the CSS, it makes the comments stack wrong:
1st comment
2nd comment
3rd comment
I would just take out the * {margin: 0;padding: 0;} but some other things on the page needs that in order for that to be displayed correctly. So my question is, how can i override the {margin: 0;padding: 0;} for just that postcomments part of the page?
Thanks! :o)
David
© Stack Overflow or respective owner